$(function () {
  //当前页
  var currentPage = 1;
  //一条多少页
  var pageSize = 5;
  //一旦进入页面  立即进行渲染
  render();

  function render() {
    // 发送请求 获取表格渲染的数据
    $.ajax({
      type: "get", //get或post
      url: "/user/queryUser", //请求的地址
      data: {
        page: currentPage,
        pageSize: pageSize
      }, //如果不需要传，则注释掉 请求的参数，a=1&b=2或{a:1,b:2}或者jq中的serialize方法，或者formData收集
      success: function (info) {
        //成功的回调函数
        console.log(info);
        // 参数2 必须是一个对象
        // 在模板中可以任意使用对象中的属性
        // isDelete 表示用户的启用状态, 1就是启用, 0就是禁用
        var htmlStr = template("tp1", info);
        $(".lt-content  tbody").html(htmlStr);

        // 配置分页
        $("#paginator").bootstrapPaginator({
          bootstrapMajorVersion: 3, //默认是2，如果是bootstrap3版本，这个参数必填
          currentPage: 1, //当前页
          totalPages: Math.ceil(info.total / info.size), //总页数
          size: "small", //设置控件的大小，mini, small, normal,large
          onPageClicked: function (event, originalEvent, type, page) {
            //为按钮绑定点击事件 page:当前点击的按钮值
            currentPage = page;
            render();
          }

        });
      }
    });
  }

  // 2. 通过事件委托给 按钮注册点击事件
  $('.lt-content  tbody').on('click', '.btn', function () {
    console.log(123);
    $('#userModal').modal('show'); // 弹出模态框
    // 用户id
    var id = $(this).parent().data('id');
    // 获取将来需要将用户置成什么状态
    var isDelete = $(this).hasClass('btn-success') ? 1 : 0;
    console.log(id, isDelete);
    // 先解绑, 再绑定事件, 可以保证只有一个事件绑定在 按钮上
    $('#submitBtn').off('click').on('click',function(){
      $.ajax({
        type:'post',//get或post
        url:'/user/updateUser',//请求的地址
        data:{
          id: id,
          isDelete: isDelete
        },//如果不需要传，则注释掉 请求的参数，a=1&b=2或{a:1,b:2}或者jq中的serialize方法，或者formData收集
        dataType:'json',//text,json,xml,jsonp
        success:function(res){//成功的回调函数
          console.log(res);
          if (res.success) {
            // 关闭模态框
            $('#userModal').modal('hide'); 
             // 重新渲染
             render();
          }
        }
      })

    })
  })
});